import React, {useState, useEffect} from 'react'
import 'antd/dist/antd.css';
import {Pagination} from 'antd';
import './manage.scss'
import config from "@/config/config";
import PostCard from "@/components/PostCard";

const api = config.api
const baseURL = api.baseURL
const post = api.post
const wls = window.localStorage

export default function Manage(props) {
  const [postList, setPostList] = useState([])
  const [totalPost, setTotalPost] = useState(0)

  const getMyArticle = (page, pageSize) => {
    /*cyGet(`我的${props.type === 'myself' ? '帖子' : '收藏'}`,
      cyUrl([baseURL, post.base, props.type === 'myself' ? post.myPost : post.myFavorite]),
      {
        token: wls.XB_token,
        page: page,
        limit: pageSize
      }
    ).then(data => {
      setPostList(data.postDtoList)
      setTotalPost(data.postSearchDto.total)
    })*/
  }

  const [pgKey, setPgKey] = useState(0)
  const [page, setPage] = useState(1)
  const [limit, setLimit] = useState(5)

  const changePage = (page, limit) => {
    setPage(page)
    setLimit(limit)
  }
  useEffect(() => {
    getMyArticle(page, limit)
  }, [page, limit])

  useEffect(() => {
    setPgKey(pgKey => {
      return pgKey + 1
    })
    getMyArticle(1, 5)
  }, [])

  useEffect(() => {
    setPage(1)
    setLimit(5)
    if (/^我的(帖子|收藏)$/.test(wls.XB_myhome_now))
      getMyArticle(1, 5)
  }, [wls.XB_myhome_now])

  return (
    <div className='micro-manage'>
      {postList ?
        postList.map((item, index) => {
          return (
            <PostCard key={index} {...item} myself={true}/>
          )
        }) : ''
      }
      <Pagination className='pagination'
                  key={pgKey}
                  showQuickJumper
                  total={totalPost}
                  showTotal={total => `累计${props.type === 'myself' ? '发帖' : '收藏'}：${total}`}
                  showSizeChanger={true}
                  pageSizeOptions={[5, 10, 15, 20]}
                  defaultCurrent={1}
                  defaultPageSize={5}
                  onChange={changePage}
      />
    </div>
  )
}
